import Text from '../elements/text';
import Line from '../elements/line';
import Circle from '../elements/circle';
import config from '../config';
import * as _ from '../utils';
export default {
    pie: function (serie, opts) {
        let elements = [];
        let data = _.getObjProperty(serie, 'data', []);
        let radius = _.getObjProperty(serie, 'radius', '50%');
        let origin = _.getObjProperty(opts, 'origin', {});

        let x = origin.x;
        let y = origin.y;
        let w = origin.w;
        let h = origin.h;

        let c_x = x + w / 2;
        let c_y = y + h / 2;
        let c_r = w > h ? h / 2 : w / 2;
        let o_r = 0;
        if ('number' === _.getObjType(radius)) {
            c_r = radius;
        } else if ('string' === _.getObjType(radius)) {
            c_r = (parseInt(radius) * c_r) / 100;
        } else if ('array' === _.getObjType(radius)) {
            o_r = (parseInt(radius[0]) * c_r) / 100;
            c_r = (parseInt(radius[1] || '90%') * c_r) / 100;
        }

        let lineWidth = c_r - o_r;
        let dataLen = data.length;

        let sumVal = 0;
        data.forEach((item, i) => {
            item.preSum = sumVal;
            sumVal += item.value;
        });
        data.forEach((item, i) => {
            let preSum = item.preSum;
            let val = item.value;
            let s = 1.5 + (preSum * 2) / sumVal;
            let e = s + (val * 2) / sumVal;
            let startAngle = Math.PI * s;
            let endAngle = Math.PI * e;
            let anticlockwise = false;

            let color = _.getObjProperty(item, 'color', config.colors[i % 9]);

            let style = {
                lineWidth: lineWidth,
                strokeStyle: color,
                fillStyle: color,
                zIndex: 10,
            };

            let circle = new Circle({
                points: [
                    {
                        x: c_x,
                        y: c_y,
                        r: (c_r + o_r) / 2,
                        startAngle,
                        endAngle,
                        anticlockwise,
                    },
                ],
                style,
                action: { fill: false },
            });
            elements.push(circle);

            let arc = Math.PI * 2 - (startAngle + endAngle) / 2;
            let r1 = (c_r + o_r) / 2;
            let r2 = c_r + 10;

            let x1 = c_x + Math.cos(arc) * r1;
            let y1 = c_y - Math.sin(arc) * r1;

            let x2 = c_x + Math.cos(arc) * r2;
            let y2 = c_y - Math.sin(arc) * r2;
            let line1 = new Line({
                points: [
                    {
                        x: x1,
                        y: y1,
                    },
                    {
                        x: x2,
                        y: y2,
                    },
                ],
                style: {
                    lineWidth: 1,
                    strokeStyle: color,
                    zIndex: 9,
                },
            });
            elements.push(line1);
            let line2 = new Line({
                points: [
                    {
                        x: x2,
                        y: y2,
                    },
                    {
                        x: x2 > c_x ? x2 + 10 : x2 - 10,
                        y: y2,
                    },
                ],
                style: {
                    lineWidth: 1,
                    strokeStyle: color,
                    zIndex: 9,
                },
            });
            elements.push(line2);

            let name = item.name;
            let nameLen = name.length * 8;

            let textStyle1 = {
                text: name,
                fillStyle: '#333333',
                textAlign: 'center',
                fontSize: 12,
            };
            let textPoints1 = [
                {
                    x: x2 > c_x ? x2 + 10 + nameLen / 2 : x2 - 10 - nameLen / 2,
                    y: y2 - 8,
                },
            ];
            let text1 = new Text({
                points: textPoints1,
                style: textStyle1,
            });

            elements.push(text1);

            let textPoints2 = [
                {
                    x: x2 > c_x ? x2 + 10 + nameLen / 2 : x2 - 10 - nameLen / 2,
                    y: y2 + 8,
                },
            ];
            let textStyle2 = {
                text: val,
                fillStyle: '#333333',
                textAlign: 'center',
                fontSize: 12,
            };
            let text2 = new Text({
                points: textPoints2,
                style: textStyle2,
            });

            elements.push(text2);
        });
        return elements;
    },
};
